<!-- 新增地址 -->
<template>
	<view class="add_box">
		<view class="add_content">
			<u-swipe-action v-for="(item, index) in list" :key="item.id" :index="index" @click="click"
				:options="options" :show="item.show" @open="open" btn-width="120" bgColor="#F8F8FB" btn_margin="24"
				:btn_radiousR="8">
			<view class="add_card" @tap="to_select(index)">
				<view class="card_left"  >
					<view class="card_left1">
						<view class="card_name">用户ID</view>
						<view class="card_phone">{{item.mobile}}</view>
					</view>
					<view class="card_left2">
						<view class="card_type" v-if="item.is_default">默认</view>
						<view class="card_place" :class="{'change_card':!item.is_default}">{{item.address}}</view>
					</view>
				</view>
				<view class="card_right" @click.stop="jumpEdit(item,index)">
					<image :src="common_img"></image>
				</view>
			</view>
			</u-swipe-action>
			<view class="bottom pf">
				<view class="add_bottom">
					<view class="bottom_text" @click.stop="jump(add_url)">新增地址</view>
				</view>
			</view>
		</view>
		 <empty :null_data="null_data" v-if="!list.length"></empty>
	</view>

</template>

<script>
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	export default {
		components: {
		},
		data() {
			return {
				//空状态
				null_data: {
				 null_img: this.imgUrl + 'nocollect.png',
				 text: '暂无送货地址~'
				},
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#FF5445',
					}
				}],
				disabled: false,
				show: false,
				value: 1,
				checked: false,
				userlist: [],
				edit_url: "/pages/user/info/address/edit/index",
				add_url: "/pages/user/info/address/add/index",
				common_img: this.imgUrl + 'common_ic_08.png'	,//编辑的图标
			}

		},
		computed: {
			...mapState({
				list: state => state.address.list,
				placeType: state => state.user.placeType,
			}),
		},
        onShow() {
            // 获取地址列表
            this.$store.dispatch('address/get_Place');
        },
		methods: {
			click(index) {
				this.$api('memberdeleteAddress',{
					address_id: this.list[index].id
				})
                this.list.splice(index, 1);
			},
			// 如果打开一个的时候，不需要关闭其他，则无需实现本方法
			open(index) {
				// 先将正在被操作的swipeAction标记为打开状态，否则由于props的特性限制，
				// 原本为'false'，再次设置为'false'会无效
				this.list[index].show = true;
				this.list.map((val, idx) => {
					if(index != idx) this.list[idx].show = false;
				})
			},
            jump(path, params) {
              this.$Router.push({
                  path: path,
                  params: params
              })  
            },
			jumpEdit(item, index) {
				this.$store.dispatch('address/get_edit', item)
				uni.navigateTo({
					url: this.edit_url + '?id=' + item.id+'&userid=' + item.userid
				})
			},
			//点击选中
			to_select(index) {
				this.$store.dispatch('address/get_selected',this.list[index]);
				if(this.placeType) {
					uni.navigateBack({
						delta: 1
					});
				} else {
					this.$Router.push({
						path: '/pages/order/index'
					})
				}
			}
		},
	}
</script>

<style scoped lang="scss">
	@import './index.scss';
</style>
